@extends('admin.layout.main')
@section("content")
    <form class="layui-form"  action="/admin/product/store" method="post">
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend>产品基础信息</legend>
        </fieldset>
        <div class="layui-form-item">
            <label class="layui-form-label">描述：</label>
            <div class="layui-input-block">
                <input type="text" name="describe" lay-verify="required" placeholder="请输入产品描述"  autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">产品名称：</label>
            <div class="layui-input-block">
                <input type="text" name="product_name" lay-verify="required" placeholder="请输入产品名称"  autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">产品类别：</label>
            <div class="layui-input-inline">
                <select name="type_id" lay-verify="required"  lay-search="">
                    <option ></option>
                    @foreach($types as $type)
                        <option value="{{$type->id}}">{{$type->name}}</option>
                    @endforeach
                </select>
            </div>
            <button type="button" class="layui-btn" id="sb" onclick="create()">添加分类</button>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">规格：</label>
            <div class="layui-input-inline">
                <select name="specifications" lay-verify="required"  lay-search="1">
                    <option>请选择一项</option>
                    <option value="个">个</option>
                    <option value="箱">箱</option>
                    <option value="套">套</option>
                    <option value="盒">盒</option>
                    <option value="瓶">瓶</option>
                    <option value="块">块</option>
                    <option value="只">只</option>
                    <option value="把">把</option>
                    <option value="枚">枚</option>
                    <option value="条">条</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">成本价</label>
                <div class="layui-input-inline" style="width: 100px;">
                    <input type="text"  name="cost_price" lay-verify="required" placeholder="￥" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">零售价</label>
                <div class="layui-input-inline" style="width: 100px;">
                    <input type="text"  name="retail_price" lay-verify="required" placeholder="￥" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-upload">
                <button type="button" name="img_upload" class="layui-btn btn_upload_img">
                    <i class="layui-icon"></i>上传图片  </button>
                <img class="layui-upload-img img-upload-view" src="">
                <p id="demoText"></p>
            </div>
            <p>
                <input type="hidden" id="img_url" name="image"/>
            </p>
        </div>
        <div class="layui-form-item">
            <input class="layui-upload-file" type="file"  name="file1">
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
    <script>
        layui.use(['form'], function(){
            var form = layui.form
            //自定义验证规则
            form.verify({
                title: function(value){
                    if(value.length < 5){
                        return '标题至少得5个字符啊';
                    }
                }
                ,pass: [/(.+){6,12}$/, '密码必须6到12位']
            });

        });

    </script>
    <script>

        layui.use(['upload','layer'], function(){
            var $ = layui.jquery
                ,upload = layui.upload;
            var layer = layui.layer;

            $('#sb').on('click', function(){
                 layer.open({
                    type: 2  //1普通公告 2
                    , title: ["大家好", 'font-size:18px;text-align:center'] //False不显示标题栏
                    , area: ['730px', '560px']
                    , shade: 0.8
                    , maxmin: true
                    , id: 'LAY_layuipro' //设定一个id，防止重复弹出
                    , btnAlign: 'c'
                    , zIndex: layer.zIndex //重点1
                    , moveType: 0 //拖拽模式，0或者1
                    , content: 'http://agonicrm.com/admin/product_type/create' //调用的函数fliters
                    , success: function (layero) {
                        var btn = layero.find('.layui-layer-btn');
                        btn.find('.layui-layer-btn0').attr({
                            href: '/'
                            , target: '_self'
                        });
                        //filter()
                    }
                });
            });

            layui.use('upload', function(){
                var upload = layui.upload;

                //var tag_token = $(".tag_token").val();
                //普通图片上传
                var uploadInst = upload.render({
                    elem: '.btn_upload_img'
                    ,type : 'images'
                    ,exts: 'jpg|png|gif' //设置一些后缀，用于演示前端验证和后端的验证
                    //,auto:false //选择图片后是否直接上传
                    //,accept:'images' //上传文件类型
                    ,url: '/admin/product/upload'
                    //,data:{'_token':tag_token}
                    ,before: function(obj){
                        //预读本地文件示例，不支持ie8
                        obj.preview(function(index, file, result){

                            $('.img-upload-view').attr('src', result); //图片链接（base64）
                        });
                    }
                    ,done: function(res){
                        //上传成功
                        if(res.status == 1){
                            alert('11');
                            $('#img_url').attr('value', res.message);
                            return layer.msg('上传成功');
                        }else{//上传失败
                            layer.msg(res.message);
                        }
                    }
                    ,error: function(){
                        //演示失败状态，并实现重传
                        return layer.msg('上传失败,请重新上传');
                    }
                });

            });



        });
    </script>
@endsection